@charset "utf-8"; 
a, abbr, acronym, address, applet, article, aside, audio,b, big, blockquote, body, caption, canvas, center, cite, code, dd, del, details, dfn, dialog, div, dl, dt, em, embed, fieldset, figcaption, figure, form, footer, header, hgroup, h1, h2, h3, h4, h5, h6, html, i, iframe, img, ins, kbd, label, legend, li, mark, menu, nav, object, ol, output, p, pre, q, ruby, s, samp, section, main, small, span, strike, strong, sub, summary, sup, tt, table, tbody, textarea, tfoot, thead, time, tr, th, td, u, ul, var, video{font-size:100%; vertical-align:baseline; white-space:normal; margin:0; padding:0; border:0; outline:0; background:transparent;}article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, main{display:block;} ol, ul{list-style:none;} blockquote, q{quotes:none;}table{border-collapse:collapse; border-spacing:0;} *{-webkit-box-sizing:border-box; -moz-box-sizing:border-box; -o-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box; -webkit-text-size-adjust:100%;} img{vertical-align:top; width: 100%;height: auto;} h1, h2, h3, h4, h5, h6{font-weight:normal;}



/*---------------------------
Link
---------------------------*/
a{outline:none; text-decoration: none; color: #fff;word-break: break-all;}
a:hover{ opacity: 0.8;}
a img:hover{ opacity: 0.8;}
a:hover{-webkit-transition:all .3s ease; transition:all .3s ease;}


/*---------------------------
Body
---------------------------*/
body{font-family:'Noto Sans JP', sans-serif, "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic"; font-style: normal; font-weight: 400; color: #333333; background: #fff; word-wrap:break-word; font-kerning:normal;font-size:15px;letter-spacing: 0.05em;}


/*---------------------------
共通
---------------------------*/
.cf:before,
.cf:after {content: " ";display: table;}
.cf:after {clear: both;}
.cf{*zoom: 1;}

.pc{display:block;}
.sp{display:none;}

@media only screen and (max-width:750px){
.pc{display:none;}
.sp{display:block;}
}

.hero{height: 100vh; display: flex; justify-content: center; align-items: center;flex-flow: column; padding-bottom: 70px;}
.hero .logo{max-width: 550px; margin: 20px auto 0;}

@media only screen and (max-width:750px){
.hero{height: 100vh; padding-bottom: 50px;}
.hero .logo{width: 70.0vw;; margin: 15px auto 0;}
}

.content{width: 90%; margin: 0 auto;}

h2{font-size: 22px; font-weight: 400; text-align: center; padding: 20px; line-height: 1.8; border-top: 1px solid #bb002d;border-bottom: 1px solid #bb002d;}

.sec01{}
.sec01 .inner{padding: 40px;}
.sec01 .inner .txt{font-size:15px; line-height: 2.5; text-align: center;}

.sec02{ margin-top: 50px;}
.sec02 .inner{padding: 40px;}
.sec02 .inner .logo-web{max-width: 170px; margin: 0 auto;}
.sec02 .inner .sample{max-width: 250px; margin: 40px auto 0;}
.sec02 .inner .txt{font-size:15px;line-height: 2.5; text-align: center; margin-top: 40px;}
.sec02 .inner .btn-box{max-width: 380px; margin: 50px auto 0;}
.sec02 .inner .btn-box a{background:#0051e0; color: #fff; text-align: center; font-size:18px; border-radius: 50px; display: block; padding: 20px;}

.sec03{ margin-top: 50px;}
.sec03 .inner{padding: 40px;}
.sec03 .inner .txt{font-size:15px; line-height: 2.5; text-align: center; margin-top: 50px;}
.sec03 .inner .insta-box{max-width:350px; margin: 0 auto;}
.sec03 .inner .form-box{max-width:600px; margin: 50px auto 0;}


@media only screen and (max-width:430px){
body{font-size: calc(100vw * 14 / 430);}
h2{font-size: calc(100vw * 22 / 430);}
.sec01 .inner{padding: 30px 5px;}
.sec01 .inner .txt{font-size: calc(100vw * 14 / 430);text-align: left;}

.sec02{ margin-top: 30px;}
.sec02 .inner{padding: 30px 5px;}
.sec02 .inner .sample{margin: 30px auto 0;}
.sec02 .inner .txt{font-size: calc(100vw * 14 / 430);text-align: left; margin-top: 40px;}
.sec02 .inner .btn-box a{font-size:17px;}

.sec03{ margin-top: 30px;}
.sec03 .inner{padding: 30px 5px;}
.sec03 .inner .txt{font-size: calc(100vw * 14 / 430);text-align: left; margin-top: 30px;}
.sec03 .inner .insta-box{max-width:350px; margin: 0 auto;}
.sec03 .inner .form-box{ margin: 20px auto 0;}

}


footer{border-top: 1px solid #bb002d; padding: 20px 0 10px; font-size: 10px; text-align: center;}



