@charset "utf-8";
/*
Theme Name: gpa_2206
Theme URI: 
Description: gpa_2206
Version: 1.0
Author: DMN.
Author URI:
Notes: 

*/


@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+JP:wght@300&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Julius+Sans+One&family=Noto+Serif+JP:wght@300&display=swap');

*,*:before, *:after{
	margin:0;
	padding:0;
	list-style-type: none;
    text-decoration: none;
    font-weight: normal;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
}

html{
    font-size: 14px;
}

body{
	color: #111;
    font-family: 'Noto Serif JP','游明朝', 'Yu mincho', 'YuMincho', serif;
	line-height: 1.8rem;
	letter-spacing:0.05rem;
    
    background-color: #ffe9eb;
}

*:focus{
    outline: none;
}

.font_01{
    font-family: 'Julius Sans One', sans-serif !important;
}

img{
    width: 100%;
    height: auto;
    vertical-align: top;
}

p{
    margin-bottom: 1rem;
}

a{
    color: #8a6e22;
}

/* ****** */
/* Mobile */

@media screen and (max-width:600px) {
    .sp_remove{
        display: none;
    }

    .menu_fixed{
        position: fixed;
        width: 100%;
        height: 100%;
        overflow: hidden;
    }

    #header{
        position: fixed;
        top: 0;
        width: 100%;
        background-color: #ffe9eb;
        z-index: 1000;
    }

    #header_inner{
        padding: 2vw;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    #logo{
        width: 50vw;
    }

    #sp_menu_button{
        font-size: 2rem;
        color: #8a6e22;
    }

    #header_inner{
        position: relative;
    }

    #header_menu_area{
        position: fixed;
        display: none;
        right: 0;
        width: 100%;
        background-color:#d377ad;
        padding: 1rem 1rem 5rem 1rem;
        z-index: 999;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        height: 100%;
    }

    #header_cart_menu{
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
        padding-bottom: 1rem;
    }

    #header_cart_menu li{
        width: 48%;
        font-size: 0.8rem;
    }

    #header_cart_menu li a{
        position: relative;
        display: block;
        padding: 1rem;
        background-color: #d1bc89;
        border: 1px #a09668 solid;
        color: #FFF;       
        text-shadow: 1px 1px 1px #666; 
    }

    #header_cart_menu li a::after{
        position: absolute;
        font-family: icomoon;
        content: "\e903";
        color: #FFF;
        right: 0.5rem;
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
    }

    #header_cart_menu li a i{
        padding-right: 1rem;
    }

    #header_menu{
        background-color: #FFF;
        padding: 2%;
    }
    #header_menu li{
        padding: 0.5rem 0;
    }
    #header_menu li a{
        display: flex;
        justify-content: space-between;
        border-left: 0.5rem #8a6e22 solid;
        padding: 0.5rem 1rem;
        border-bottom: 1px #999 dotted;
    }

    .header_menu_subtitle{
        font-size: 0.8rem;
    }


    


    #index_main{
        width: 100%;
        background: url(images/bg_index.jpg) no-repeat;
        background-size: cover;
        background-position: center;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    #index_main_title{
        
        font-size: 1.3rem;
        filter: drop-shadow(2px 2px 2px #d377ad);
        padding: 1rem 0;
        color: #FFF;
        line-height: 2em;
        letter-spacing:0.2rem;
    }
    
    #index_main_title span{
        display: block;
        text-align: center;

    }

    .send{
        display: flex;
        justify-content: center;
    }

    .send a{
        padding: 0.5rem 3rem;
        background-color: #d1bc89;
        border: 1px #a09668 solid;
        color: #FFF;
        text-shadow: 1px 1px 1px #666;
    }

    .send a:hover{
        background-color: #999;
        transition: .5s;
    }

    #main_area{
        width: 100%;
        background: linear-gradient(0deg, rgba(155,104,169,0) 0%, rgba(155,104,169,1) 100%);
        padding-bottom: 2rem;
    }

    #main_area_inner{
        padding: 2rem 0;
        background: url(images/bg_main_02.png) repeat;
        background-size: contain;
        background-position: top center;
    }

    .index_main_button{
        padding: 2rem 0;
    }

    .h2_page{
        color: #8a6e22;
        font-size: 1.3rem;
        line-height: 1.6em;
        letter-spacing:0.3rem;
        text-align: center;
        text-shadow: 1px 1px 2px #FFF, -1px -1px 2px #FFF,
              -1px 1px 2px #FFF, 1px -1px 2px #FFF,
              0px 1px 2px #FFF,  0-1px 2px #FFF,
              -1px 0 2px #FFF, 1px 0 2px #FFF;
        padding: 2em 0;
    }

    .h2_page span{
        display: block;
    }

    .default{
        padding: 0 2%;
    }

    #index_menu ul li{
        margin: 1rem 0;
    }
    #index_menu ul li a{
        position: relative;
        display: flex;
        background-color: #FFF;
        padding-right: 1rem;

    }

    #index_menu ul li a::after{
        position: absolute;
        font-family: icomoon;
        content: "\e903";
        color: #AF9B79;
        right: 0.5rem;
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
    }

    .index_menu_img{
        width: 35%;
    }

    .index_menu_img img{
        height: 100%;
        object-fit: cover;
    }

    .index_menu_content{
        width: 65%;
        padding-left: 0.5rem;
    }

    .index_menu_title{
        padding-bottom: 0.5rem;
    }

    .index_menu_description{
        color: #333;
    }

    .index_menu_button{
        width: 100%;
        padding: 0.5rem 0;
        background-color: #d1bc89;
        border: 1px #a09668 solid;
        color: #FFF;
        text-align: center;
        margin-top: auto;
        text-shadow: 1px 1px 1px #999;
    }

    #schedule_inner{
        background-color: rgb(209,186,218,0.4);
        padding: 2%;
    }

    #schedule_inner ul li{
        padding: 0.5rem 0;
    }

    #schedule_inner ul li a{
        position: relative;
        display: block;
        background-color: #FFF;
        padding: 1rem;
    }

    #schedule_inner ul li a::after{
        position: absolute;
        font-family: icomoon;
        content: "\e903";
        color: #AF9B79;
        right: 1rem;
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
    }

    #schedule_inner ul li a:hover{
        background-color: rgba(255,255,255,0.6);
        transition: .5s;
    }

    .schedule_title{
        font-size: 1.2rem;
        padding-bottom: 1rem;
    }

    .schedule_content{
        color: #333;
    }

    .schedule_content dl dt i{
        display: inline-block;
        width: 2rem;
        color: #d377ad;
    }

    .dl_table_group{
        display: flex;
    }

    .schedule_content dl dt{
        width: 10rem;
        background: #efefef;
        border: 1px #FFF solid;
    }

    .schedule_content dl dd{
        width: calc(100% - 10rem);
    }

    .index_schedule_button{
        padding: 2rem 0;
    }

    .schedule_content dd span{
        display: block;
    }

    #index_profile_text{
        background: rgba(255,255,255,0.7);
        padding: 1rem;
    }

    #index_info_inner{
        background-color: rgba(234, 104, 162,0.4);
        padding: 2%;
    }

    #index_info_inner ul li{
        margin: 0.5rem 0;
    }

    #index_info_inner ul li a{
        position: relative;
        display: block;
        padding: 1rem;
        background-color: rgba(255,255,255,0.9);
    }

    #index_info_inner ul li a::after{
        position: absolute;
        font-family: icomoon;
        content: "\e903";
        color: #AF9B79;
        right: 1rem;
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
    }

    #index_info_inner ul li a:hover{
        background-color: rgba(239, 239, 239,0.8);
        transition: .5s;
    }

    .index_info_title{
        color: #333;
        padding: 0 2rem;
    }

    .index_info_date i{
        padding-right: 1rem;
    }

    #footer{
        background-color: #404040;
        padding: 1rem;
    }

    #footer_content_area{
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    #footer_logo{
        width: 200px;
    }

    #copyright{
        color: #FFF;
        font-size: 0.8rem;
    }

}

/* ** */
/* PC */

@media screen and (min-width:601px) {
    .pc_remove{
        display: none;
    }

    #wrapper{
        min-width: 1100px;
    }

    #header{
        position: fixed;
        display: flex;
        justify-content: center;
        width: 100%;
        padding: 1rem;
        background-color: #ffe9eb;
        z-index: 1000;
    }

    #header_inner{
        display: flex;
        justify-content: space-between;
        align-items: flex-end;
        width: 1100px;
    }

    #logo {
        width: 160px;
    }

    #header_menu{
        display: flex;
        justify-content: flex-end;
        flex-wrap: wrap;
    }

    #header_menu li{
        font-size: 0.8rem;
    }

    #header_menu li a{
        display: block;
        padding: 0 1rem;
        text-shadow: 1px 1px 1px #FFF;
    }

    #header_menu li a:hover{
        background-color: #FFF;
        border-radius: 1rem;
        transition: .5s;
    }

    #header_cart_menu{
        display: flex;
        justify-content: flex-end;
        padding-bottom: 1rem;
    }

    #header_cart_menu li{
        font-size: 0.5rem;
        margin: 0 0.5rem;
    }

    #header_cart_menu li a{
        display: block;
        padding: 0rem 1rem;
        background-color: #d1bc89;
        border: 1px #a09668 solid;
        color: #FFF;
    }

    #header_cart_menu li a:hover{
        background-color: #999;
        transition: .5s;
    }

    #header_cart_menu li a i{
        padding-right: 1rem;
    }

    .header_menu_subtitle{
        display: none;
    }

    #main{
        width: 100%;
    }

    #index_main{
        width: 100%;
        background: url(images/bg_index.jpg) no-repeat;
        background-size: cover;
        background-position: center;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    #index_main_title{
        
        font-size: 4vh;
        filter: drop-shadow(2px 2px 2px #d377ad);
        padding: 1rem 0;
        color: #FFF;
        line-height: 1.6em;
        letter-spacing:0.3rem;
    }
    
    #index_main_title span{
        display: block;
        text-align: center;

    }

    .send{
        display: flex;
        justify-content: center;
    }

    .send a{
        padding: 0.5rem 3rem;
        background-color: #d1bc89;
        border: 1px #a09668 solid;
        color: #FFF;
        text-shadow: 1px 1px 1px #999;
    }

    .send a:hover{
        background-color: #999;
        transition: .5s;
    }

    #side_sns{
        position: fixed;
        top: 40vh;
        right: 2rem;
    }

    #side_sns ul{
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    #side_sns ul li{
        padding: 0.5rem 0;
    }
    #side_sns ul li a{
        display: block;
        font-size: 2.4rem;
        text-shadow: 1px 1px 4px #FFF, -1px -1px 4px #FFF,
              -1px 1px 4px #FFF, 1px -1px 4px #FFF,
              0px 1px 4px #FFF,  0-1px 4px #FFF,
              -1px 0 4px #FFF, 1px 0 4px #FFF;
    }

    #side_sns ul li a:hover{
        color: #ccc;
        transition: .5s;
    }

    #main_area{
        width: 100%;
        background: linear-gradient(0deg, rgba(155,104,169,0) 0%, rgba(155,104,169,1) 100%);
        padding-bottom: 2rem;
    }

    #main_area_inner{
        padding: 2rem 0;
        background: url(images/bg_main_02.png) repeat;
        background-size: contain;
        background-position: top center;
    }

    .index_main_button{
        padding: 2rem 0;
    }

    .h2_page{
        color: #8a6e22;
        font-size: 1.8rem;
        line-height: 1.6em;
        letter-spacing:0.3rem;
        text-align: center;
        text-shadow: 1px 1px 4px #FFF, -1px -1px 4px #FFF,
              -1px 1px 4px #FFF, 1px -1px 4px #FFF,
              0px 1px 4px #FFF,  0-1px 4px #FFF,
              -1px 0 4px #FFF, 1px 0 4px #FFF;
        padding: 3em 0;
    }

    .h2_page span{
        display: block;
    }

    #index_menu{
        padding-bottom: 3rem;
    }

    #index_menu ul{
        display: flex;
        justify-content: space-between;
    }

    #index_menu ul li{
        width: 240px;
        padding: 1%;
    }
    
    #index_menu ul li a{
        display: flex;
        background-color: #FFF;
        flex-direction: column;
        height: 100%;
    }

    #index_menu ul li a:hover .index_menu_button{
        background-color: #999;
        transition: .5s;
    }

    #index_menu ul li a:hover{
        background-color: #fff7fc;
        transition: .5s;
    }


    .index_menu_content{
        padding: 1rem;
    }

    .index_menu_title{
        color: #8a6e22;
        text-align: center;
        padding-bottom: 1rem;
    }

    .index_menu_description{
        color: #333;
    }

    .index_menu_button{
        width: 100%;
        padding: 0.5rem 0;
        background-color: #d1bc89;
        border: 1px #a09668 solid;
        color: #FFF;
        text-align: center;
        margin-top: auto;
        text-shadow: 1px 1px 1px #999;
    }

    #schedule_inner{
        background-color: rgb(209,186,218,0.4);
        padding: 1rem;
    }

    .default{
        width: 1100px;
        margin: 0 auto;
    }

    #schedule_inner ul li{
        padding: 0.5rem 0;
    }

    #schedule_inner ul li a{
        position: relative;
        display: block;
        background-color: #FFF;
        padding: 2%;
    }

    #schedule_inner ul li a::after{
        position: absolute;
        font-family: icomoon;
        content: "\e903";
        color: #AF9B79;
        right: 1rem;
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
    }

    #schedule_inner ul li a:hover{
        background-color: rgba(255,255,255,0.6);
        transition: .5s;
    }

    .schedule_title{
        font-size: 1.2rem;
        padding-bottom: 1rem;
    }

    .schedule_content{
        color: #333;
    }

    .schedule_content dl dt i{
        display: inline-block;
        width: 2rem;
        color: #d377ad;
    }

    .dl_table_group{
        display: flex;
    }

    .schedule_content dl dt{
        width: 10rem;
        background: #efefef;
        border: 1px #FFF solid;
    }

    .index_schedule_button{
        padding: 2rem 0;
    }

    #index_profile_inner{
        width: 100%;
        background-color: rgba(182,124,158,0.7);
        background-image: url(images/bg_index_profile_01.png);
        background-repeat: no-repeat;
    }

    #index_profile_content{
        position: relative;
    }

    #index_profile_text{
        position: absolute;
        background: rgba(255,255,255,0.8);
        padding: 3rem;
        width: 600px;
        margin: 2rem;
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        box-shadow: 1rem 1rem 1px rgba(197,147,176,0.4);

    }

    #index_info_inner{
        background-color: rgba(234, 104, 162,0.4);
        padding: 1.5rem 2rem;
    }

    #index_info_inner ul li{
        margin: 0.5rem 0;
    }

    #index_info_inner ul li a{
        position: relative;
        display: block;
        padding: 1rem;
        background-color: rgba(255,255,255,0.9);
    }

    #index_info_inner ul li a::after{
        position: absolute;
        font-family: icomoon;
        content: "\e903";
        color: #AF9B79;
        right: 1rem;
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
    }

    #index_info_inner ul li a:hover{
        background-color: rgba(239, 239, 239,0.8);
        transition: .5s;
    }

    .index_info_title{
        color: #333;
        padding: 0 2rem;
    }

    .index_info_date i{
        padding-right: 1rem;
    }

    #footer{
        width: 100%;
        background-color: #404040;
        padding: 1rem;
    }

    #footer_menu ul{
        display: flex;
        justify-content: center;
    }

    #footer_menu ul li{
        font-size: 0.8rem;
        margin: 0.5rem 1rem;
    }

    #footer_menu ul li a{
        color: #FFF;
    }

    #footer_content_area{
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    #footer_logo{
        width: 200px;
    }

    #copyright{
        color: #FFF;
        font-size: 0.8rem;
    }

}