@charset "UTF-8";

body {
	margin: 0;
	padding: 0;
	line-height: 1.6em;
	color: #222;
	background: #fff;
	font-size: 14px;
	font-weight: 100;
	font-family: "Noto Sans JP", "ヒラギノ角ゴシック", "Hiragino Sans", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: auto;
}

h1, h2, h3, h4, h5, h6, h7,
ul, ol, li, dl, dt, dd,
article, section,
div, figure, p, form, img, legend, i {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 1em;
	list-style: none;
	font-style: normal;
	font-weight: normal;
}

a ,
button ,
span {
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
	transition: all  0.2s ease;
	text-decoration: none!important;
}

a:hover {
	color: #0b518e;
	text-decoration: none!important;
}

a:hover img {
	opacity: .75;
	filter: alpha(opacity=75);
	-ms-filter: "alpha(opacity=75)";
	-khtml-opacity: .75;
	-moz-opacity: .75;
}

.clearfix:before,
.clearfix:after {
	content: " ";
	display: table;
}

.clearfix:after {
	clear: both;
}
 
.clearfix {
	*zoom: 1;
}

.clear {
	clear: both!important;
}

.pc{display:block;}
.sp{display:none;}
.wrapper{
	width:900px;
	margin:0 auto;
	padding-top:100px;
}
header{
	position: fixed;
	top:0;
}
.app-btn{
	display:flex;
}

.line-btn{
	background:#06c755;
}
.line-btn a{margin:0 200px;}
.line-btn a:hover{opacity:.8}
p{
	margin:0; padding:0
}
.contact-btn{
	margin:60px 40px 0;
}
.contact-btn2{
	margin:60px 40px;
}
.contact-btn3{
	background:#0e8be3;
	padding: 80px 40px;
    margin: 0 0 60px;
}
.contact-btn3 a{
	margin-bottom:20px;
	display:block;
}
.contact-btn4{
	background:#0e8be3;
	padding: 80px 40px;
    margin: 60px 0;
}
.contact-btn4 a{
	margin-bottom:20px;
	display:block;
}
.contact-btn a:hover,
.contact-btn2 a:hover,
.contact-btn3 a:hover,
.contact-btn4 a:hovef{opacity:.8}
.qr-form{
	margin:60px 250px;
}
footer{
	background:#005a8e;
	padding:20px;
}
footer .copy{
	color:#fff;
	font-size:.8em;
	text-align:center
}

@media only screen and (min-width:641px) and (max-width:960px){
.wrapper, img{width:100%; height:auto}
.wrapper{padding-top:11%;}
.line-btn a{margin:0;}
}
@media only screen and (max-width:640px){
.wrapper, img{width:100%; height:auto}
.wrapper{padding-top:11%;}
.line-btn a{margin:0;}
.contact-btn{
	margin:20px 10px 0;
}
.contact-btn2{
	margin:20px 10px;
}
.contact-btn3{
	margin:0 0 20px;
	padding:20px;
}
.contact-btn3 a{
	margin-bottom:0;
}
.contact-btn4{
	margin:20px 0 0;
	padding:20px;
}
.contact-btn4 a{
	margin-bottom:0;
}
.qr-form{
	margin:20px 60px;
}
.pc{display:none;}
.sp{display:block;}
}