@charset "utf-8";



html     ,
body     ,
article  ,
section  ,
div      ,
h1       ,
h2       ,
h3       ,
h4       ,
h5       ,
dl       ,
dt       ,
dd       ,
ul       ,
ol       ,
li       ,
p        ,
input    ,
select   ,
textarea {
	margin:0;
	padding:0;
    font-family: 'Noto Sans JP', sans-serif, "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
    font-weight: 500;
	color: #222;
	font-size: 16px;
	font-feature-settings: "palt"1;
	line-height: 2;
	letter-spacing: 0.15rem;
	-webkit-text-size-adjust: 100%;
	border:none;
}

.en ,
footer small {
    font-size: 1.2rem;
    font-weight: 700;
    font-family: 'Secular One', sans-serif;
}

html {
	overflow-y:scroll;
	margin-bottom:1px;
	height:100%;
    scroll-behavior: smooth;
}

body {
    background:url("../img/bg.jpg") repeat;
}

img {
    max-width:100%;
	margin:0;
	padding:0;
    display:block;
	vertical-align:bottom;
	line-height:0;
	border:none;
    -webkit-backface-visibility: hidden;}

ul ,
ol {list-style:none;}

li {list-style-position:outside;}

table {border-collapse:collapse;}

th ,
td {padding:0;
	text-align:left;
	vertical-align:top;}

a {
	color:#222;
	text-decoration:none;
	transition: .2s;}

p {
	text-align:justify;
	text-justify:inter-ideograph;}

::selection {background:#ffffa0;}
::-moz-selection {background:#ffffa0;}

@media only screen and (min-width:641px){ .sp { display:none !important;} }
@media only screen and (max-width:640px){ .pc { display:none !important;} }



/* header */

header {
    width:90%;
    margin:auto;
    display:flex; flex-flow:row wrap; justify-content:center; align-content:center; align-items:center;
    position:absolute; top:40px; left:0; right:0;
}
header img {
    max-width:100%;
}

@media only screen and (max-width:640px){
    
    header {
        top:20px;
    }
}



/* main */

main {
    width:100%;
    margin:0 auto;
    padding-top:100px;
    display:flex; flex-flow:row wrap; justify-content:center; align-content:center; align-items:center;
    background:url("../img/main-bg-pc.jpg") top center no-repeat;
}
main img {
    max-width:100%;
}

@media only screen and (max-width:640px){
    
    main {
        padding-top:120px;
        background:url("../img/main-bg-sp.jpg") top center no-repeat;
        background-size: contain;
        background-position:0 90px;
    }
}



/* section */

section {
    width:100%;
    margin: 0 auto;
    padding:0 0 50px;
    display:flex; flex-flow:row wrap; justify-content:center; align-content:flex-start; align-items:flex-start;
    position:relative;
}

@media only screen and (max-width:640px){
    
    section {
        padding:0 0 20px;
    }
}



/* calendar */

.calendar {}

@media only screen and (max-width:640px){
    
    .calendar {
        margin-top: -30px;
    }
}



/* giftshop */

.giftshop {}
.giftshop > div {
    width:100%;
    max-width:1030px;
    position:relative;
}
.giftshop > div > a {
    display:block;
}
.giftshop > div > a span {
    margin:0 auto;
    padding:20px 20px 20px 0;
    display:block;
    color:#231815;
    font-size:1.5rem;
    font-weight:900;
    text-align: center;
    line-height:1;
    border: solid 2px #231815;
    border-bottom: solid 8px #231815;
    border-radius:20px;
    position: relative;
    background:#fff100;
    transition: .2s;
}
.giftshop > div > a:hover span {
    -webkit-transform: translateY(2px);
    transform: translateY(2px);
    border-bottom: solid 4px #231815;
}
.giftshop > div > a span::before {
    content: "";
    width: 15px;
    height:15px;
    margin:auto;
    position:absolute; top:0; bottom:0; right:25px;
    vertical-align: middle;
    border-top:4px solid #231815;
    border-right:4px solid #231815;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    transition: .3s;
}
.giftshop > div > a span:hover::before {
    right:20px;
}

@media only screen and (min-width:641px){
    
    .giftshop > div > a {
        width:280px;
        position:absolute; bottom:60px; left:45px;
    }
}

@media only screen and (max-width:640px){
    
    .giftshop {
        margin: 30px auto;
        position:relative;
    }
    .giftshop > div > img {
        margin-top:-15px;
    }
    .giftshop > div > a {
        width:80%;
        margin: 15px auto 0;
    }
    .giftshop::after {
        content: "";
        width:90%;
        height:100%;
        margin: auto;
        position:absolute; top:0; left:0; right:0;
        border-radius: 15px;
        background:#0e612c;
        z-index: -1;
    }
}



/* footer */

footer {
    width:100%;
    margin: 0 auto;
    padding:0 0 100px;
}
footer small {
    width:100%;
    display:block;
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: 0.08rem;
    text-align:center;
}

@media only screen and (max-width:640px){
    
    footer {
        padding:20px 0 50px;
    }
    footer small {
        font-size: 0.9rem;
        letter-spacing: 0.05rem;
    }
}


