@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+JP');

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    font-size: 62.5%;
    width: 100%;
    height: auto;
}

body {
    font-size: 16px;
    line-height: 1.6;
    color: #333;
    font-family: font-family: 'ＭＳ Ｐ明朝', 'MS PMincho', 'ＭＳ 明朝', 'MS Mincho', 'ヒラギノ明朝 ProN', 'Hiragino Mincho ProN', 'Yu Mincho Light', 'YuMincho', 'Yu Mincho', '游明朝体', 'ヒラギノ明朝 ProN', 'Hiragino Mincho ProN', sans-serif;
    ;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;

    width: 100%;
    height: auto;

    min-width: 300px;
}

/**/

header {
    background-color: #f1cbc2;
    background-size: cover;
}

.header_mv {
    width: 1000px;
    margin: 0 auto;
    background-color: #f1cbc2;
}

.logo img {
    width: 1000px;
    height: auto;
    display: block;
    margin: 0 auto;
}

.logo_mv img {
    width: 1000px;
    height: auto;
    display: block;
    margin: 0 auto;
}

/*smh_mv*/

.logo_smh img {
    width: 100%;
    height: auto;
    display: block;
    margin: 0 auto;
    text-align: center;
}

/**/


.header_list a {
    text-decoration: none;
    color: #888;
    padding: 20px 10px 0 10px;
}

.header_list a:hover {
    border-bottom: 3px solid #fff;
    text-shadow: 1px 2px 3px #fff;
}

.header_list ul {
    display: flex;
    flex-wrap: wrap;
}

.header_list li {
    padding: 20px;
    margin: 0 auto;
}

.header_list {
    margin: 0 auto;
    padding: 20px 0 30px 0;
}

.taiken img {
    width: 23%;
    height: auto;
    padding: 20px 20px 20px 30px;
}











/*main*/

.main {
    width: 1000px;
    display: block;
    margin: 0 auto;
    text-align: center;
    padding: 150px 0 150px 0;
}

.section_about {
    display: flex;
    flex-wrap: wrap;
    width: 1000px;
}

.about {
    width: 500px;
    height: auto;
}

.about_center {
    font-size: 30px;
    font-weight: 700;
    text-shadow: 1px 3px 3px #c6c6c6;
    letter-spacing: .1em;
    display: block;
    text-align: center;
    color: #35b6d5;
}

.center_p {
    display: inline-block;
    padding-left: 80px;
    padding-bottom: 30px;
    text-shadow: 1px 1px 4px #fff;
    background-color: rgba(255, 255, 255, 0.53);
}

.about_phot img {
    width: 300px;
    height: 360px;
}

.about_phot {
    padding-left: 80px;
}

/**/

.concept {
    width: 500px;
    height: auto;
}


.consept_title {
    letter-spacing: .2em;
    font-weight: 700;
    text-shadow: 1px 3px 3px #c6c6c6;
    display: block;
    text-align: center;
    font-size: 25px;
}

.concept_lesson {
    background-image: url(../images/yuri.png);
    background-size: cover;
    height: 250px;
    width: 500px;
}


/**/

.minage_p_pad{
    padding-left: 15px;
}



.cafe_top {
    width: 500px;
}

.black {
    font-weight: 700;
    font-size: 28px;
    color: #444;
    text-shadow: 1px 3px 3px #d9d9d9;
}

.cafe_phot1 img {
    width: 300px;
    height: 300px;
    margin: 0 auto;
    padding-right: 20px;
}

.cafe_phot2 img {
    width: 180px;
    height: auto;
    margin: 0 auto;
}

.cafe_phot {
    display: flex;
    flex-wrap: wrap;
    width: 500px;
    padding-top: 20px;
}

.phot2 img {
    padding-top: 18px;
}



/**/
.lesson {
    margin: 0 auto;
    display: block;
    background-color: #fdfed6;
    min-width: 300px;
}


.lesson_top {
    padding-top: 100px;
    width: 1000px;
    margin: 0 auto;
    padding: 50px 0;
    background-color: #fdfed6;
}


h3 {
    display: block;
    text-align: center;
    background-color: #fdfed6;
}

.tt_logo {
    background-color: #fdfed6;
}

.taiken {
    width: 500px;
    height: auto;
}

.taiken a:hover {
    opacity: .5;
}

.taiken img {
    width: 230px;
    height: auto;
}

.taiken_list {
    display: flex;
    flex-wrap: wrap;
    padding-bottom: 80px;
}

.info {
    width: 500px;
}

.info p {
    text-align: center;
    padding: 0 30px;
    font-size: 20px;
    letter-spacing: .2em;
    font-weight: 700;
}


.lesson_link {
    background-color: #35b6d5;
    border-radius: 10px;
    text-align: center;
    padding: 5px 0;
    box-shadow: 1px 5px 5px #888;
}

.lesson_link a {
    text-decoration: none;
    color: #fff;
}

.lesson_link:hover {
    background-color: #f1cbc2;
    box-shadow: none;
}

/*event*/

.event_p p {
    font-size: 20px;
    font-weight: 700;
    letter-spacing: .2em;
}

.brand {
    font-size: 30px;
    color: #888;
    padding: 5px;
}

.brand_s {
    font-size: 22px;
    color: #888;
    padding: 5px;
}

.event_list {
    display: flex;
    justify-content: center;
    padding-bottom: 100px;
}

.event_v img {
    width: 600px;
    height: auto;
    padding-left: 100px;
}


.padding_b150 {
    padding-bottom: 150px;
}

.size26 {
    font-size: 26px;
}

.padding {
    padding-bottom: 150px;
}

/*plof*/



.plofile {
    display: flex;
    flex-wrap: wrap;
}

.plof_img img {
    width: 700px;
    height: auto;
}

.plof_img {
    margin: 0 auto;
    text-align: center;
}

.este_salon p {
    display: inline-block;
    width: 450px;
    height: auto;
    line-height: 2em;
    letter-spacing: .2em;
}

.este_salon {
    padding: 0 25px;
}

.este_top img {
    padding-top: 30px;
}

.description {
    padding: 100px 0;
    text-align: center;
    line-height: 2em;
    letter-spacing: .2em;
    width: 1000px;
    background-color: #fdfed6;
    margin: 0 auto;

}

.contact a {
    text-decoration: none;
    display: inline-block;
    background-color: #35b6d5;
    color: #fff;
    padding: 5px 10px;
    box-shadow: 1px 5px 5px #888;
    border-radius: 30px;
}

.contact a:hover {
    background-color: #f1cbc2;
    box-shadow: none;
}

.size20 {
    font-size: 20px;
    font-weight: 700;
}

/*lesson_salon*/

.menu {
    width: 800px;
    margin: 0 auto;
    height: auto;
    border: 2px solid #333;
    box-shadow: 1px 5px 5px #888;
    padding: 100px 30px;
}

.menu_tt {
    display: inline-block;
    width: 700px;
    margin: auto;
    text-align: center;
    letter-spacing: .5em;
    font-weight: 900;
    font-size: 30px;
}

.menu_p {
    letter-spacing: .2em;
    line-height: .1;
}

.center_menu_tt {
    display: inline-block;
    width: 700px;
    text-align: center;
    font-weight: 700;
    font-size: 20px;
    text-align: center;
}

.menu_tt_right {
    font-weight: 700;
}

.sikaku {
    color: #35b6d5;
    text-shadow: 1px 5px 5px #cbcbcb;
}

.red {
    color: red;
    border-bottom: 2px solid red;
}

.pinky {
    color: #f1cbc2;
    text-shadow: 1px 5px 5px #cbcbcb;
}

.size25 {
    font-size: 25px;
    text-align: center;
    display: block;
    text-shadow: 1px 2px 3px #777;
}

.concept_este {
    width: 450px;
    height: auto;
}

.concept {
    width: 450px;
}

.menu_concept {
    display: flex;
    justify-content: center;
    background-color: #fdfed6;
    background-size: cover;
    margin: 0 auto;
    padding: 80px 0;
    width: 1000px;
}


.back_color {
    background-color: #fdfed6;
    background-size: cover;
    padding: 30px;
    border-radius: 50px;
}

.cp {
    width: 400px;
    display: block;
    text-align: center;
    line-height: 2em;
    background-color: #f1cbc2;
    margin: 0 auto;
    padding: 10px 20px;
    box-shadow: 1px 5px 5px #cbcbcb;
    color: #888;
    border-bottom: 5px solid #e3c2ba;
}

.cp a {
    text-decoration: none;
    color: #fff;
}

.cp:hover {
    box-shadow: none;
    background-color: #35b6d5;
    border-bottom: none;
    border-top: 5px solid #fff;
}

.cp p {
    display: block;
    text-align: center;
}


.minage_tt {
    font-size: 28px;
    display: block;
    text-align: center;
    text-shadow: 1px 5px 5px #777;
}

.minage_b {
    color: #333;
    letter-spacing: .2em;
    font-weight: 700;
}

.center_menu {
    text-align: center;
    display: block;
}

.issie_img img {
    width: 400px;
    height: auto;
    padding-left: 40px;
}

.issie_p {
    width: 500px;
    height: auto;
}

.issie {
    display: flex;
    flex-wrap: wrap;
    padding: 80px 0;
}

.issie_mini {
    display: flex;
    flex-wrap: wrap;
    padding: 50px 0;
}



.minage_img_mini img {
    width: 400px;
    height: 300px;
    padding-left: 40px;
}


.clos {
    color: #c3c3c3;
    text-shadow: 1px 5px 5px #cbcbcb;
}

.minage_img img {
    width: 400px;
    height: 300px;

}

.minage_img {
    padding-top: 30px;
    margin: 0 auto;
}

.minage_img_hana img {
    width: 400px;
    height: auto;
    padding-bottom: 30px;

}

.minage_img_hana {
    width: 400px;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 0 auto;

}


.minage_img_macaron img {
    width: 400px;
    height: 500px;
}

.minage_img_macaron {
    margin: 0 auto;
}

.minage_phot {
    display: flex;
    justify-content: space-between;
}

/*event_contena*/

.ev_con {
    width: 1000px;
    margin: 0 auto;
    background-color: #fdfed6;
    display: flex;
    justify-content: space-between;
    margin: 0 auto;
}

.event_contact {
    width: 1000px;
    margin: 0 auto;
}

.ec_contena {
    width: 1000px;
    display: flex;
    flex-wrap: wrap;
}

.ec_p {
    width: 500px;
    padding-left: 30px;
}

.ec_img {
    width: 500px;
    margin: 0 auto;
    text-align: center;
}

.ec_img img {
    width: 300px;
    height: auto;
    padding: 30px 0;
    margin: 0 auto;
}

.vegun_img {
    width: 500px;
    display: flex;
    flex-direction: column;
    margin: 0 auto;
}

.vegun_img img {
    width: 300px;
    height: auto;
    padding: 30px 0;
    margin: 0 auto;
}

.vigan_url a {
    color: #000;
    background-color: #f1cbc2;
    padding: 5px 10px;
}

.vigan_url a:hover {
    opacity: .5;
}


/*PRIVACYPOLICY*/
.privacy_policy {
    padding: 0 5px;
}



.pp_link a {
    color: #35b6d5;
}

.p_plof_top a {
    color: #35b6d5;
}

.pp_p {
    font-weight: 600;
}

.p_plof {
    width: 1000px;
    margin: 0 auto;
    padding: 30px 5px;
    background-color: #fdfed6;
    background-size: cover;
}

.pp_tt {
    font-weight: 700;
}

.pp_map {
    display: flex;
    justify-content: space-between;
}



/*contact_btn*/

.contact_btn a {
    text-decoration: none;
    color: #fff;
    background-color: #35b6d5;
    padding: 10px 15px;
    border-radius: 30px;
    box-shadow: 1px 5px 5px #777;
}

.contact_btn a:hover {
    background-color: #f1cbc2;
    box-shadow: none;
}

.contact_btn {
    padding: 30px 0 0 30px;
    margin: 0 auto;
}

/*lite_btn*/

.lite_btn a {
    text-decoration: none;
    color: #fff;
    background-color: #35b6d5;
    padding: 5px 10px;
    border-radius: 10px;
}

.lite_btn a:hover {
    background-color: #fdfed6;
    color: #35b6d5;
    border: 2px solid #35b6d5;
    background-color: #fff;
}

.lite_btn {
    display: block;
    text-align: right;
    margin-right: 50px;
}


/*contact*/

.ct_logo {
    border: 3px solid #35b6d5;
    color: #35b6d5;
    padding: 5px 10px;
    box-shadow: 1px 3px 3px #999;
    font-weight: 700;
    background-color: #fdfed6;
    background-size: cover;
}

.contact_form {
    display: block;
    text-align: center;
    padding-top: 100px;
    width: 1000px;
    background-color: #fdfed6;
    background-size: cover;
    margin: 0 auto;
}

.mimonde_link a {
    color: #35b6d5;
}

.mimonde_link img {
    width: 200px;
    height: auto;
    box-shadow: 1px 5px 5px #999;
}

.mimonde_link {
    width: 600px;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    padding: 0 5px;
}

.mimonde_link p {
    padding-left: 30px;
    line-height: 2em;
}



/*form*/
.form {
    color: #35b6d5;
}

.contact_form {
    display: flex;
    justify-content: space-between;
    width: 1000px;
}

.contact_midasi {
    widows: 400px;
    font-size: 20px;
    background-color: #8ad1be;
    color: #fff;
    padding: 5px 10px;
    border-radius: 10px;
    display: block;
    text-align: center;
}

.contact_midasi {
    width: 400px;
}


.form_plof {
    width: 400px;
    margin: 0 auto;
    padding: 30px 5px;
    background-color: #fdfed6;
    background-size: cover;
}

/*eventetc*/

.event_sk {
    width: 1000px;
    display: flex;
    flex-wrap: wrap;
}

.event_contena {
    width: 700px;
    height: auto;
    padding-bottom: 150px;
}

.event_contena p {
    padding-left: 30px;
}

h5 {
    font-size: 25px;
    text-shadow: 1px 5px 5px #999;
}

.france {
    display: flex;
    justify-content: space-between;
    padding: 30px;
}

.france img {
    width: 300px;
    height: 200px;
}

.ev_main {
    display: flex;
    flex-wrap: wrap;
}

.event_inst a {
    color: #35b6d5;
}


/*event_contact*/
.event_btn {
    width: 300px;
    display: block;
    text-align: center;
    padding-top: 30px;
}

.event_btn a {
    text-decoration: none;
    background-color: #35b6d5;
    padding: 10px 20px;
    margin: 0 auto;
    text-align: center;
    color: #fff;
    box-shadow: 1px 5px 5px #888;
    border-bottom: 5px #26849b solid;
}

.event_btn a:hover {
    border-bottom: none;
    box-shadow: none;
    background-color: #35b6d5;
}

.event_btn_smh {
    width: 300px;
    display: block;
    text-align: center;
    margin: 0 auto;
    padding-top: 100px;
}

.event_btn_smh a {
    text-decoration: none;
    background-color: #35b6d5;
    padding: 10px 20px;
    margin: 0 auto;
    text-align: center;
    color: #fff;
    box-shadow: 1px 5px 5px #888;
    border-bottom: 5px #26849b solid;
}

.event_btn_smh a:hover {
    border-bottom: none;
    box-shadow: none;
    background-color: #35b6d5;
}

.event_phot {
    display: flex;
    justify-content: space-between;
    width: 400px;
    padding-top: 30px;
}

.event_phot img {
    width: 300px;
    height: 200px;
    margin: 0 auto;
}

.event_contena_2 {
    width: 600px;
    height: auto;
    padding-bottom: 150px;
    display: flex;
    justify-content: space-between;
}

.event_ct {
    display: flex;
    flex-wrap: wrap;
}

.event_contena_2 p {
    padding-left: 30px;
}

.ev_sk {
    width: 1000px;
}

.ev_box {
    width: 300px;
}

/*footer*/


footer {
    background-color: #f1cbc2;
    min-width: 300px;
    margin: 0 auto;
}


.sns_link a {
    text-decoration: none;
    color: #888;
    font-size: 14px;
    padding: 0 20px;
}

.sns_link a:hover {
    border-bottom: 3px solid #fff;
    text-shadow: 1px 2px 3px #fff;
}

.sns_link ul {
    display: flex;
    flex-wrap: wrap;
}

.sns_link {
    background-color: #f1cbc2;
    background-size: cover;
    width: 1000px;
    margin: 0 auto;
}

.sns_link li {
    display: block;
    margin: 0 auto;
    padding: 30px 0 80px 0;
}


/*ハンバーガー*/
/*チェックボックス等は非表示に*/
.nav-unshown {
    display: none;
}





/*スマホ*/
@media screen and (max-width:768px) {

    /*    mainmv*/
    .logo_mv {
        display: none;
        width: 480px;
    }





    /*1000px*/

    .header_mv,
    .logo_smh img,
    .main,
    .section_about,
    .lesson_top,
    .description,
    .menu_concept,
    .ev_con,
    .event_contact,
    .ec_contena,
    .p_plof,
    .contact_form,
    .event_sk,
    .ev_sk,
    .sns_link {
        width: 100%;
    }

    .logo img,
    .tt_logo img {
        width: 100%;
    }


    .about,
    .concept,
    .cafe_top,
    .cafe_phot,
    .taiken,
    .info {
        width: 480px;
        margin: 0 auto;
    }

    .concept_lesson {
        width: 100%;
    }

    .taiken img {
        width: 45%;
    }

    .brand,
    .brand_s,
    .info p {
        font-size: 15px;
    }

    .event_p p {
        font-size: 14px;
        width: 130%;
    }

    /*  plof  */

    .plof_img img {
        width: 450px;
    }
    
    .este_top{
        margin: 0 auto;
    }

    .menu,
    .menu_tt,
    .center_menu_tt {
        width: 100%;
    }

    .menu {
        border: none;
        box-shadow: none;
        font-size: 14px;
        padding: 100px 0;
    }

    .menu_concept {
        display: block;
        width: 480px;
        padding: 5px;
    }

    .concept_este {
        padding: 50px 0;
    }
    
    .description p{
        padding: 0 10px;
    }
    
/*    este*/
     .este_menu p{
        padding: 0 10px;
    }

    /*   workshop */
    .event_contact {
        width: 100%;
    }

    .ec_p {
        padding: 0 10px;
    }

    /*  cafeminage  */
    .issie_img img {
        padding: 0;
    }

    .issie_img {
        margin: 0 auto;
    }

    .minage_phot {
        display: flex;
        flex-wrap: wrap;
        padding-bottom: 80px;
    }



    /*   privacypolicy */
    .pp_map {
        display: flex;
        flex-wrap: wrap;
    }

    .mimonde_link a img {
        width: 100px;
    }

    /*    event*/
    event_ct {
        width: 100%;
    }

    .event_contena {
        width: 100%;
    }

    .france {
        display: flex;
        flex-wrap: wrap;
        width: 100%;
    }

    .france img {
        width: 400px;
        height: 300px;
        margin-top: 30px;
        text-align: center;
    }

    h5 {
        font-size: 18px;
        text-shadow: none;
        padding: 0 10px;
    }

    .event_btn {
        display: none;
    }

    .event_contena_2 {
        width: 480px;
        display: flex;
        flex-wrap: wrap;
    }

    .ev_box p {
        font-size: 14px;
    }

    .event_phot img {
        width: 400px;
        height: 300px;
    }

    .event_phot {
        margin: 0 40px;
    }


    /*    contact*/

    .contact_form {
        width: 480px;
        display: flex;
        flex-wrap: wrap;
        margin: 0 auto;
    }

    .calender,
    .form_plof {
        width: 100%;
        text-align: center;
        margin: 0 auto;
    }

    .lesson,
    .contact_minasi,
    .calendar {
        width: 480px;
    }

    iframe {
        margin: 0 auto;
        width: 450px;
        text-align: center;
    }

    .contact_midasi {
        margin: 0 auto;
    }

    .lesson {
        background-color: #fdfed6;
        width: 100%;
    }

    .contact_list{
        padding: 0 10px;
    }
    

    /*ハンバーガー*/

    /*ヘッダーまわりはサイトに合わせて調整してください*/
    header {
        padding: 10px;
        background: #f1cbc2;
    }

    #nav-drawer {
        position: relative;
    }

    /*チェックボックス等は非表示に*/
    .nav-unshown {
        display: none;
    }

    /*アイコンのスペース*/
    #nav-open {
        display: inline-block;
        width: 30px;
        height: 22px;
        vertical-align: middle;
    }

    /*ハンバーガーアイコンをCSSだけで表現*/
    #nav-open span,
    #nav-open span:before,
    #nav-open span:after {
        position: absolute;
        height: 3px;
        /*線の太さ*/
        width: 25px;
        /*長さ*/
        border-radius: 3px;
        background: #ffffff;
        display: block;
        content: '';
        cursor: pointer;
    }

    #nav-open span:before {
        bottom: -8px;
    }

    #nav-open span:after {
        bottom: -16px;
    }

    /*閉じる用の薄黒カバー*/
    #nav-close {
        display: none;
        /*はじめは隠しておく*/
        position: fixed;
        z-index: 99;
        top: 0;
        /*全体に広がるように*/
        left: 0;
        width: 100%;
        height: 100%;
        background: black;
        opacity: 0;
        transition: .3s ease-in-out;
    }

    /*中身*/
    #nav-content {
        overflow: auto;
        position: fixed;
        top: 0;
        left: 0;
        z-index: 9999;
        /*最前面に*/
        width: 90%;
        /*右側に隙間を作る（閉じるカバーを表示）*/
        max-width: 330px;
        /*最大幅（調整してください）*/
        height: 100%;
        background: #fff;
        /*背景色*/
        transition: .3s ease-in-out;
        /*滑らかに表示*/
        -webkit-transform: translateX(-105%);
        transform: translateX(-105%);
        /*左に隠しておく*/
    }

    /*チェックが入ったらもろもろ表示*/
    #nav-input:checked ~ #nav-close {
        display: block;
        /*カバーを表示*/
        opacity: .5;
    }

    #nav-input:checked ~ #nav-content {
        -webkit-transform: translateX(0%);
        transform: translateX(0%);
        /*中身を表示（右へスライド）*/
        box-shadow: 6px 0 25px rgba(0, 0, 0, .15);
    }



}




/*スマホ*/
@media screen and (max-width:479px) {

    /*    mainmv*/
    .logo_mv {
        display: none;
        width: 300px;
    }





    /*1000px*/

    .header_mv,
    /*.logo img,*/
    .logo_smh img,
    .main,
    .section_about,
    .lesson_top,
    .description,
    .menu_concept,
    .ev_con,
    .event_contact,
    .ec_contena,
    .p_plof,
    .contact_form,
    .event_sk,
    .ev_sk,
    .sns_link {
        width: 100%;
    }

    .logo img,
    .tt_logo img {
        width: 100%;
    }


    .about,
    .concept,
    .cafe_top,
    .cafe_phot,
    .taiken,
    .info,
    .concept_p{
        width: 300px;
        margin: 0 auto;
    }
    
    .event_v img,
    .lesson_link{
        width: 290px;
        margin: 0 auto;
    }


    .concept_lesson {
        width: 100%;
        background-size: 290px 200px;
    }

    .taiken img {
        width: 45%;
    }

    .brand,
    .brand_s,
    .info p {
        font-size: 15px;
    }

    .event_p p {
        font-size: 14px;
        width: 100%;
    }

    .main {
        padding: 50px 0;
    }

    /*    index*/

    .about_center {
        margin: 0 auto;
    }
    
    .about_center img{
        width: 250px;
        height: auto;
    }

    .center_p,
    .about_phot,
    .cafe_top p,
    .event_p {
        padding: 0;
        font-size: 14px;
    }

    .size26,
    .brand,
    .brand_s {
        font-size: 16px;
    }

    .black,
    .consept_title {
        font-size: 18px;
    }

    .cafe_phot1 img {
        width: 160px;
        height: auto;
        padding: 0;
        margin-left: 20px;
        margin-right: 5px;
    }

    .cafe_phot2 img {
        width: 100px;
        height: auto;
        padding: 0;
    }

    .cafe_phot {
        margin: 0 auto;
    }

    .event_list {
        display: flex;
        flex-wrap: wrap;
        padding: 0;
    }

    .event_v img {
        padding: 50px 0 0 0;
    }

    /*  plof  */

    .plof_img img,
    .este_top img,
    .plof_img,
    .este_top {
        width: 250px;
        margin: 0 auto;
    }

    .este_salon p,
    .description p {
        font-size: 14px;
    }

    .este_salon,
    .este_salon p {
        padding: 0;
        width: 300px;
    }

    .este_salon p,
    .description {
        padding: 0 10px;
    }

    .size20 {
        font-size: 16px;
    }

    .menu,
    .menu_tt,
    .center_menu_tt {
        width: 100%;
    }

    .menu {
        border: none;
        box-shadow: none;
        font-size: 14px;
        padding: 100px 0;
    }

    .menu_concept {
        display: block;
        width: 300px;
        padding: 5px;
    }

    .concept_este {
        padding: 50px 0;
    }

    /*    este*/
    .concept_este,
    .concept_este p {
        width: 300px;
    }

    .cp {
        width: 280px;
    }

    .menu_concept {
        padding: 0;
    }

    .concept_este p {
        font-size: 14px;
    }

    .size25 {
        font-size: 18px;
    }

    .menu_tt,
    .center_menu_tt {
        font-size: 15px;
    }


    /*   workshop */
    .event_contact {
        width: 100%;
    }

    .ec_p {
        padding: 0;
    }

    .minage_img_hana img {
        width: 300px;
        height: 200px;
        padding: 10px;
    }

    .ec_img img {
        width: 300px;
        height: 200px;
        padding: 10px;
    }

    .vegun_img img {
        width: 300px;
        height: 400px;
        padding: 10px;
    }

    /*  cafeminage  */
    .issie_img img,
    .minage_img {
        padding: 0;
    }

    .issie_img {
        margin: 0 auto;
    }

    .minage_phot {
        display: flex;
        flex-wrap: wrap;
        padding-bottom: 80px;
    }

    .minage_b p {
        font-size: 18px;
    }

    .issie_p p,
    .minage_b p,
    p {
        font-size: 14px;
        padding: 0 10px;
    }

    .issie_img img,
    .minage_img_macaron img {
        padding: 10px;
        width: 300px;
        height: auto;

    }

    .lite_btn {
        margin: 0 auto;
    }

    .minage_img img {
        width: 300px;
        height: 200px;
        padding: 10px;
        margin: 0 auto;
    }


    /*   privacypolicy */
    .pp_map {
        display: flex;
        flex-wrap: wrap;
    }

    .mimonde_link a img {
        width: 100px;
    }

    .mimonde_link {
        width: 290px;
        padding: 0;
    }
    
    .mimonde_link p{
        padding: 10px;
    }


    /*    event*/
    event_ct {
        width: 100%;
    }

    .event_contena {
        width: 100%;
    }

    .france {
        display: flex;
        flex-wrap: wrap;
        width: 100%;
    }

    .france img {
        width: 300px;
        height: 200px;
        margin-top: 30px;
        text-align: center;
        padding: 10px;
    }

    h5 {
        width: 300px;
        font-size: 18px;
        text-shadow: none;
        padding: 50px 10px 0 10px;
    }

    .event_btn {
        display: none;
    }

    .event_contena_2 {
        width: 300px;
        display: flex;
        flex-wrap: wrap;
    }

    .ev_box p {
        font-size: 14px;
    }

    .event_ct,
    .event_main,
    .sk_2 {
        width: 300px;
    }

    .france {
        padding: 0;
    }

    .event_contena {
        width: 300px;
        padding: 0;
    }

    .event_phot img {
        width: 300px;
        height: 200px;
        padding: 10px;
    }

    .event_phot {
        width: 300px;
        margin: 0;
        padding: 0;
    }

    .event_contena_2 p {
        width: 300px;
    }


    /*    contact*/

    .contact_form {
        width: 300px;
        display: flex;
        flex-wrap: wrap;
        margin: 0 auto;
    }

    .calender,
    .form_plof {
        width: 100%;
        text-align: center;
        margin: 0 auto;
    }

    .lesson {
        background-color: #fdfed6;
        width: 100%;
    }

    iframe {
        margin: 0 auto;
        width: 280px;
        text-align: center;
    }

    .contact_midasi {
        margin: 0 auto;
    }

    .calendar p {
        width: 300px;
    }

    .contact_midasi {
        width: 280px;
    }


    /*ハンバーガー*/

    /*ヘッダーまわりはサイトに合わせて調整してください*/
    header {
        padding: 10px;
        background: #f1cbc2;
    }

    #nav-drawer {
        position: relative;
    }

    /*チェックボックス等は非表示に*/
    .nav-unshown {
        display: none;
    }

    /*アイコンのスペース*/
    #nav-open {
        display: inline-block;
        width: 30px;
        height: 22px;
        vertical-align: middle;
    }

    /*ハンバーガーアイコンをCSSだけで表現*/
    #nav-open span,
    #nav-open span:before,
    #nav-open span:after {
        position: absolute;
        height: 3px;
        /*線の太さ*/
        width: 25px;
        /*長さ*/
        border-radius: 3px;
        background: #ffffff;
        display: block;
        content: '';
        cursor: pointer;
    }

    #nav-open span:before {
        bottom: -8px;
    }

    #nav-open span:after {
        bottom: -16px;
    }

    /*閉じる用の薄黒カバー*/
    #nav-close {
        display: none;
        /*はじめは隠しておく*/
        position: fixed;
        z-index: 99;
        top: 0;
        /*全体に広がるように*/
        left: 0;
        width: 100%;
        height: 100%;
        background: black;
        opacity: 0;
        transition: .3s ease-in-out;
    }

    /*中身*/
    #nav-content {
        overflow: auto;
        position: fixed;
        top: 0;
        left: 0;
        z-index: 9999;
        /*最前面に*/
        width: 90%;
        /*右側に隙間を作る（閉じるカバーを表示）*/
        max-width: 330px;
        /*最大幅（調整してください）*/
        height: 100%;
        background: #fff;
        /*背景色*/
        transition: .3s ease-in-out;
        /*滑らかに表示*/
        -webkit-transform: translateX(-105%);
        transform: translateX(-105%);
        /*左に隠しておく*/
    }

    /*チェックが入ったらもろもろ表示*/
    #nav-input:checked ~ #nav-close {
        display: block;
        /*カバーを表示*/
        opacity: .5;
    }

    #nav-input:checked ~ #nav-content {
        -webkit-transform: translateX(0%);
        transform: translateX(0%);
        /*中身を表示（右へスライド）*/
        box-shadow: 6px 0 25px rgba(0, 0, 0, .15);
    }



}







/*ハンバーガースマホ以外*/
@media screen and (min-width:768px) {
    #nav-open {
        display: none;



    }

    .logo_smh,
    .event_btn_smh {
        display: none;
    }

}