@charset "UTF-8";
/* CSS Document */

#wrapper { opacity: 0 }

#abth_thanks { font-family: 'Helvetica Neue', Helvetica, Arial, "sans-serif"; overflow: hidden }

#abth_thanks #graphic { height: 760px; width: 100%; overflow: hidden; position: relative }
#abth_thanks #graphic ul { width: 6994px; position: absolute; left:  0; top: 0 }
#abth_thanks #graphic ul li { float: left }

#abth_thanks .greeting { padding: 60px 0 }
#abth_thanks .greeting h1 { margin: 80px 0 40px }
#abth_thanks .greeting h2 { margin: 80px 0 60px; font-size: 18px }
#abth_thanks .greeting h3 { margin: 0 0 40px }
#abth_thanks .greeting p { font-family: YuMincho, 'Yu Mincho', serif; }
.btn_special { width: 50%; border: solid 5px #e4e4e4; margin: 60px auto  }
.btn_special a { display: block; padding: 24px 0; position: relative }
.btn_special a .arw { position: absolute; right: 10px; top: 50%; margin-top: -22px }
.btn_special a:hover { background: #e4e4e4 }

#abth_thanks .works { text-align: center; position: relative; padding-bottom: 160px }
#abth_thanks .works .works_inner { padding: 80px; min-width: 980px; max-width: 1200px; margin: 0 auto }
#abth_thanks .works .works_inner h2 { padding: 0 20px; font-size: 20px; margin-bottom: 40px }
#abth_thanks .works .works_inner li { width: 20%; float: left; opacity: 0; transform: scale(1.1); }
#abth_thanks .works .works_inner li span { padding: 20px; display: block; }
#abth_thanks .works .count { position: fixed; right: 100px; bottom: 40px; font-size: 24px; display: none }
#abth_thanks .works .count .num { font-size: 48px }
#abth_thanks .works .thankyou { opacity: 0; padding: 40px 0 0 }
#abth_thanks .works .thankyou h1 { margin-bottom: 20px }

#gotop { position: fixed; right: 15px; bottom: -60px; z-index: 10; cursor: pointer }


@media screen and (max-width: 780px) {
	
	#abth_thanks #graphic { height: 380px; width: 100%; overflow: hidden; position: relative }
#abth_thanks #graphic ul { width: 3497px; position: absolute; left:  0; top: 0 }
#abth_thanks #graphic ul li { float: left }
	#abth_thanks #graphic ul li img { height: 380px }

#abth_thanks .greeting { padding: 60px 15px }
	#abth_thanks .greeting .logo img { width: 150px }
#abth_thanks .greeting h1 { margin: 40px 0 30px }
	#abth_thanks .greeting h1 img { width: 90% }
	#abth_thanks .greeting .logo_corp img { width: 120px }
#abth_thanks .greeting h2 { margin: 40px 0; font-size: 16px }
#abth_thanks .greeting h3 { margin: 0 0 40px }
	#abth_thanks .greeting h3 img { width: 100% }
#abth_thanks .greeting p { font-family: YuMincho, 'Yu Mincho', serif }
.btn_special { width: 100%; border: solid 5px #e4e4e4; margin: 40px auto 0  }
.btn_special a { display: block; padding: 24px 0; position: relative }
	.btn_special a .t { width: 80% }
.btn_special a .arw { position: absolute; right: 10px; top: 50%; margin-top: -22px; display: none }
.btn_special a:hover { background: #e4e4e4 }

#abth_thanks .works { text-align: center; position: relative; padding-bottom: 120px }
#abth_thanks .works .works_inner { padding: 40px 15px; min-width: auto; max-width: auto; margin: 0 auto }
#abth_thanks .works .works_inner h2 { padding: 0 20px; font-size: 18px; margin-bottom: 30px }
#abth_thanks .works .works_inner li { width: 33.3%; float: left; opacity: 0; transform: scale(1.1); }
#abth_thanks .works .works_inner li span { padding: 10px; display: block; }
#abth_thanks .works .count { position: fixed; width: 100%; text-align: center; right: 0; bottom: 10px; font-size: 20px; display: none }
#abth_thanks .works .count .num { font-size: 40px }
#abth_thanks .works .thankyou { opacity: 0; padding: 40px 0 0 }
#abth_thanks .works .thankyou h1 { margin-bottom: 20px }
#abth_thanks .works .thankyou h1 img { width: 100% }
	
#gotop { position: fixed; right: 5px; bottom: -60px; z-index: 10; cursor: pointer }
#gotop img { width: 30px }
	
}