@charset "UTF-8";

/*---------- ページ全体の指定 ----------*/

body {
margin:0;
padding:0;
font-size:100%;
color:#111;
background-image:url("img/bg.webp") ;
background-position:center center;
background-size:cover;
background-attachment:fixed;
font-family: "Noto Sans Japanese";
}


/*---------- リンク設定 ----------*/

a:link {color:#37859a;text-decoration:underline;}
a:visited {color:#37859a;text-decoration:underline;}
a:hover {color:#139eb1;text-decoration:none;}
a{-webkit-transition:0.3s ease-in-out;-moz-transition:0.3s ease-in-out;-o-transition:0.3s ease-in-out;transition:0.3s ease-in-out;}
a img {border-style:none;}
img {vertical-align:bottom;image-rendering:-webkit-optimize-contrast;}
a:hover img{filter:brightness(1.2);}
a img {border-style:none;-webkit-transition:all .3s;transition:all .3s;}


/*---------- ベーステキストの指定 ----------*/

p {
    font-size:110%;
    line-height:180%;
    margin-block-start: 1em;
    font-size: 17.6px;
    white-space: normal;
}
@media screen and (min-width:769px){
p {font-size:20px;letter-spacing:1px;}
}


/*---------- 見出し ----------*/

h1{}
h2{}
h3{}
h4{}


/*---------- PC・スマホの非表示指定 ----------*/

@media screen and (max-width:768px){.spnone{display:none;}}
@media screen and (min-width:769px){.pcnone{display:none;}}


#wrapper{margin:0 auto;padding:0;background-color:#fff;}
@media screen and (min-width:769px){
#wrapper{width:600px;box-shadow:0 0 60px rgba(69,42,27,0.5);}
}

.yureru {animation: yureru 2s infinite;}
@keyframes yureru {
0% {transform: translate(0px, 3px);}
5% {transform: translate(0px, -3px);}
10% {transform: translate(0px, 3px);}
15% {transform: translate(0px, -3px);}
20% {transform: translate(0px, 3px);}
25% {transform: translate(0px, -3px);}
30% {transform: translate(0px, 0px);}
}
.reflection{
margin:0;
padding:0;
display:inline-block;
position:relative;
overflow:hidden;
}
.reflection:after {
content:"";
height:100%;
width:30px;
position:absolute;
top:-180px;
left:0;
background-color: #fff;
opacity:0;
-webkit-transform: rotate(45deg);
-webkit-animation: reflection 2s ease-in-out infinite;
} 
@keyframes reflection {
0% { -webkit-transform: scale(0) rotate(45deg); opacity: 0; }
80% { -webkit-transform: scale(0) rotate(45deg); opacity: 0.5; }
81% { -webkit-transform: scale(4) rotate(45deg); opacity: 1; }
100% { -webkit-transform: scale(50) rotate(45deg); opacity: 0; }
}

.btn{
margin:0 30px 15px 30px;
padding:0;
}
.btn img{width:100%;}

.txt{
margin:0 30px 45px 30px;
padding:0;
}
.prf_bg{
margin:0;
padding:0 0 60px 0;
background:#1b1b1b;
}
.prf_txt{
margin:0 20px;
padding:0;
background:#fff;
}
.movie{margin:0 30px;padding:0;}
.video{
margin:0;
padding:0;
position:relative;
width:100%;
padding-top:56.25%;
}
.video iframe{
position:absolute;
top:0;
right:0;
width:100%;
height:100%;
}
@media screen and (min-width:769px){
.txt{margin:0 60px 60px 60px;}
}

#footer{
margin:0;
padding:30px 0;
font-size:80%;
line-height:150%;
text-align:center;
color:#333;

font-size: 12.8px;
}
@media screen and (min-width:769px){
#footer{font-size:12px;}
}





/*---------- 文字装飾 ----------*/

.bold{font-weight:bold;}
.ul{text-decoration:underline;}
.purple {font-weight:bold;color:#640350;}
.red {font-weight:bold;color:#c30d23;}
.ym{background:linear-gradient(transparent 0%, #fdfb8f 0%);}


/*---------- 文字位置 ----------*/

.center{text-align:center;}
.right{text-align:right;}
