/* -----------------------------------
   リセット 必要ない場合削除 */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, a:hover,abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-style:normal;
    font-weight: normal;
    list-style:  none;
}
h1,h2,h3,h4,h5,h6,td,th,p,ul,li,dt,dd {
    font-size: 1em;
}

.wf-sawarabimincho { font-family: "Sawarabi Mincho"; }

body {
	-webkit-text-size-adjust: 100%;
	font-size: 13.5px;
	font-family: "Sawarabi Mincho","ヒラギノヒラギノ明朝 Pro W3", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif, "メイリオ";
	width: 100%;
	height: 100%;
	color: #111;
}

/* ------------ containts ---------------- */

#containts{
	width: 1200px;
	margin: 0 auto;
	background: url(../img/bg.png) 50% 0% repeat;
}

/* ------------ header ---------------- */

header{
	width: 100%;
	height: 50px;
	background: #fff;
}

header h1{
	width: 280px;
}

#container{
	width: 100%;
	height: auto;
	margin: 0 auto;
	background: url(../img/flower.png) 50% 100% no-repeat;
}

section.one{
	width: 100%;
	height: auto;
	margin: 0 auto;
	background: #727171;
}

.reflection-img{
	width:1200px;
	height:640px;
	position:relative;
	overflow:hidden;
}
 
.reflection {
	height:100%;
	width: 60px;
	position:absolute;
	top:-360px;
	left:-10px;
	background-color: #fff;
	opacity:0;
	transform: rotate(45deg);
	animation: reflection 1.5s ease-in-out 2;
	-webkit-transform: rotate(45deg);
	-webkit-animation: reflection 1.5s ease-in-out 2;
	-moz-transform: rotate(45deg);
	-moz-animation: reflection 1.5s ease-in-out 2;
	-ms-transform: rotate(45deg);
	-ms-animation: reflection 1.5s ease-in-out 2;
	-o-transform: rotate(45deg);
	-o-animation: reflection 1.5s ease-in-out 2;
}
 
@keyframes reflection {
	0% { transform: scale(0) rotate(45deg); opacity: 0; }
	80% { transform: scale(0) rotate(45deg); opacity: 0.3; }
	81% { transform: scale(4) rotate(45deg); opacity: 0.8; }
	100% { transform: scale(50) rotate(45deg); opacity: 0; }
}
@-webkit-keyframes reflection {
	0% { -webkit-transform: scale(0) rotate(45deg); opacity: 0; }
	80% { -webkit-transform: scale(0) rotate(45deg); opacity: 0.3; }
	81% { -webkit-transform: scale(4) rotate(45deg); opacity: 0.8; }
	100% { -webkit-transform: scale(50) rotate(45deg); opacity: 0; }
}
@-moz-keyframes reflection {
	0% { -moz-transform: scale(0) rotate(45deg); opacity: 0; }
	80% { -moz-transform: scale(0) rotate(45deg); opacity: 0.3; }
	81% { -moz-transform: scale(4) rotate(45deg); opacity: 0.8; }
	100% { -moz-transform: scale(50) rotate(45deg); opacity: 0; }
}
@-ms-keyframes reflection {
	0% { -ms-transform: scale(0) rotate(45deg); opacity: 0; }
	80% { -ms-transform: scale(0) rotate(45deg); opacity: 0.3; }
	81% { -ms-transform: scale(4) rotate(45deg); opacity: 0.8; }
	100% { -ms-transform: scale(50) rotate(45deg); opacity: 0; }
}
@-o-keyframes reflection {
	0% { -o-transform: scale(0) rotate(45deg); opacity: 0; }
	80% { -o-transform: scale(0) rotate(45deg); opacity: 0.3; }
	81% { -o-transform: scale(4) rotate(45deg); opacity: 0.8; }
	100% { -o-transform: scale(50) rotate(45deg); opacity: 0; }
}

#present_btn{
	width: 1070px;
	height: 105px;
	margin: 0 auto;
	overflow: hidden;
}

#present_btn img{
	width: 485px;
	height: 51px;
	margin: 27px 25px;
	float: left;
}

section.two{
	width: 1060px;
	height: auto;
	margin: 0 auto;
	padding: 50px 0 40px;
}

section.two h2{
	width: 100%;
	margin: 0 auto 30px;
	text-align: center;
}

.box{
	width: 1060px;
	height: auto;
	margin: 0 auto;
	padding-bottom: 20px;
	background: #00aeb0;
	color: #fff;
}

section.two h3{
	width: 100%;
	margin: 0 auto;
	padding-top: 15px;
	text-align: center;
	font-size: 22px;
}

section.two ul{
	width: 810px;
	height: auto;
	margin: 5px auto;
	overflow: hidden;
}

section.two li{
	width: 240px;
	height: 61px;
	margin: 10px;
	float: left;
}

section.two p{
	width: 1000px;
	margin: 0 auto;
	font-size: 13.5px;
	line-height: 1.7;
}

section.three{
	width: 1140px;
	height: auto;
	margin: 0 auto;
	padding: 30px 0;
}

section.four{
	width: 1060px;
	height: auto;
	margin: 0 auto;
	padding: 30px 0 130px;
}

a:hover{
	opacity: 0.9;
}

/* ------------ footer ---------------- */

footer{
	width: 1060px;
	height: 30px;
	margin: 0 auto;
	background: #fff;
	border-top: 1px solid #111;
	padding: 20px 70px;
	text-shadow: none;
}

footer ul{
	width: 660px;
	height: 30px;
	float: left;
}

footer li{
	width: auto;
	height: 20px;
	margin-right: 25px;
	float: left;
}

footer li a{
	text-decoration: underline;
	color: #111;
}

footer li a:hover{
	opacity: 0.8;
}

footer p.cr{
	width: 400px;
	height: 20px;
	float: right;
	text-align: right;
}


/* ------------ googleリマーケティングタグ隙間対策 ---------------- */

iframe[name="google_conversion_frame"] { position: absolute; top: 0; }