@charset "UTF-8";

/*---------- ページ全体の指定 ----------*/

body {
margin:0;
padding:0;
font-size:100%;
color:#111;
background-color:#fff;
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%;
}
@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;}}


#mv{margin:0;padding:0;}
#mv img{width:100%;}
@media screen and (min-width:769px){
#mv{
text-align:center;
background-image:url("img/mv_bg.jpg") ;
background-position:center center;
background-repeat:no-repeat;
}
#mv img{width:100%;}
}


#wrapper{
margin:0;
padding:30px 20px 25px 20px;
background-image:url("img/bg.jpg") ;
background-position:center center;
background-size:auto 100%;
}
.mail_title{
margin:0 0 20px 0;
padding:0;
font-size:140%;
font-weight:bold;
line-height:150%;
text-align:center;
color:#fff;
}
.mailbox{margin:0;padding:0;}
input[type="email"] {
border:0;
padding:20px 10px;
font-size:120%;
border:solid 1px #ccc;
text-align:center;
appearance:none;
box-shadow: inset 1px 4px 9px -6px rgba(0,0,0,0.5);
box-sizing:border-box;
}
input[type="text"]:focus,
textarea:focus {
box-shadow:0 0 7px #999999;
border:1px solid #666;
}
::-webkit-input-placeholder{color:#999;}
::-moz-placeholder{color:#999;}
:-moz-placeholder{color:#999;}
:-ms-input-placeholder{color:#999;}
.button{
margin:0;
padding:10px 10px 0 10px;
text-align:center;
}
.button img:hover{filter:brightness(1.2);}

.animate {
animation:fuwafuwa 1s ease 0s infinite alternate;
transform-origin:center;
cursor:pointer;
}
@keyframes fuwafuwa {
from {transform: scale(0.9,0.9);}
to {transform: scale(1,1);}
}

.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);}
}


@media screen and (min-width:769px){
#wrapper{padding:60px 0 60px 0;background-size:cover;}
.mail_title{
margin:0 0 20px 0;
font-size:34px;
}
.mailbox{
width:720px;
margin:0 auto;
padding:0;
}
input[type="email"] {padding:30px 10px;font-size:36px;}
.button{padding:20px 0 0 0;}
}


/*------------------------------ フッター ------------------------------*/

#footer{
margin:0;
padding:30px 0;
font-size:75%;
line-height:200%;
text-align:center;
color:#f9f9f9;
background:#2e2e2e;
}
.footer_link{margin:0;padding:0 0 15px 0;}
.footer_link a:link {color:#f9f9f9;text-decoration:none;}
.footer_link a:visited {color:#f9f9f9;text-decoration:none;}
.footer_link a:hover {color:#fff;text-decoration:underline;}
@media screen and (min-width:769px){
#footer{padding:45px 0;font-size:12px;}
}



/*---------- 文字装飾 ----------*/

.bold{font-weight:bold;}
.ul{text-decoration:underline;}
.red {color:#c30d23;}

/*---------- 文字位置 ----------*/

.center{text-align:center;}
.right{text-align:right;}