/*====================================

	----------------------------------
  		Structure
  	----------------------------------

  	0. General
  	1. Header
  	2. Main
  	3. Footer
  	4. Page

  	----------------------------------
  		Change Log
  	----------------------------------
	
	-2017/11/19	 Fixed all

====================================*/

/*====================================

	0. General

====================================*/
@import url('https://fonts.googleapis.com/css?family=Marcellus+SC|Noto+Sans');
@import url('http://fonts.googleapis.com/earlyaccess/notosansjapanese.css');


body { -webkit-animation: fadeIn 2s ease 0s 1 normal; animation: fadeIn 2s ease 0s 1 normal; }
@keyframes fadeIn {
    0% {opacity: 0; }
    100% {opacity: 1; }
}
@-webkit-keyframes fadeIn {
    0% {opacity: 0; }
    100% {opacity: 1; }
}


html { font-size: 62.5%; }
body { position: relative; background: #ffffff; color: #666666; font-size: 1.0rem; font-family: "Noto Sans", "Noto Sans Japanese", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Yu Gothic", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif"; }
img { vertical-align: bottom; }
a { color: #333333; text-decoration: none; }
a:hover { text-decoration: underline; }
ul, ol { list-style: none; }

div.inner { display: block; overflow: hidden; margin: 0 auto; min-width: 1200px; zoom: 1; }
.spOnly { display: none; }
#page-top { position: fixed; right: 20px; bottom: 20px; z-index: 100; }
#page-top a { display: block; width: 70px; height: 70px; background: url(../img_20180710/icon_pagetop.svg) no-repeat 0 0; text-indent:-9999px; }


/*====================================

	1. Header

====================================*/
header { margin-bottom: 34px; padding: 37px 0 26px; min-width: 1000px; background: url(/lovela-bandai/w_de_otoku/img_20180710/header_bg.gif) no-repeat 50% 0; text-align: center; }



/*====================================

	2. Main

====================================*/
main {  }



/*====================================

	3. Footer

====================================*/
footer { padding: 40px 0 60px; text-align: center; font-size: 1.4rem; }
footer p { margin-top: 30px; }

/*====================================

	4. Page

====================================*/
section.block01 { margin-bottom: 28px; }
section.block01 h2 { margin-bottom: 20px; text-align: center; }
section.block01 nav { text-align: center; }
section.block01 nav li { display: inline-block; margin: 0 17px; }
section.block01 nav a:hover img { opacity: 0.7; }
section.block02 { padding: 45px 0 50px; background: #00a0e9 url(../img_20180710/pc_img16.png) no-repeat 50% 0 / 100% auto; text-align: center; }
section.block02 h2 { margin-bottom: 28px; }
section.block02 figure { margin-bottom: 35px; }
section.block02 div { margin: 0 auto; padding-bottom: 40px; width: 1000px; background: #ffffff; }
section.block02 div h3 { margin-bottom: 25px; padding: 10px 0; background: #fff100; color: #00a0e9; font-size: 2.8rem; line-height: 1; }
section.block02 div p { margin-bottom: 20px; font-size: 2rem; }
section.block02 div ul.app { margin-bottom: 35px; background: url(../img_20180710/line_dot.gif) repeat-y 50% 0; text-align: center; }
section.block02 div ul.app li { display: inline-block; width: 400px; }
section.block02 div ul.app dt { display: inline-block; margin-bottom: 15px; padding: 10px 33px; border-radius: 20px; color: #ffffff; font-size: 1.8rem; line-height: 1; }
section.block02 div ul.app li.android dt { background: #ec6d56; }
section.block02 div ul.app li.iPhone dt { background: #004986; }
section.block02 div ul.notice { margin: 0 40px; text-align: left; font-size: 1.2rem; }
section.block02 div ul.notice li { padding-left: 1.5em; text-indent: -1.5em; line-height: 1.8; }

section.block03 { padding: 45px 0 50px; background: #62b852 url(../img_20180710/pc_img17.png) no-repeat 50% 0 / 100% auto; text-align: center; }
section.block03 h2 { margin-bottom: 28px; }
section.block03 figure { margin-bottom: 35px; }
section.block03 div { margin: 0 auto; padding-bottom: 40px; width: 1000px; background: #ffffff; }
section.block03 div h3 { margin-bottom: 25px; padding: 10px 0; background: #fff100; color: #59ae4a; font-size: 2.8rem; line-height: 1; }
section.block03 div p { margin-bottom: 20px; font-size: 2rem; }
section.block03 div p small { font-size: 1.4rem; }
section.block03 div p figure { display: block; margin-top: 0px; }
section.block03 ul.step { margin: 0 40px; background: url(../img_20180710/line_dot_green.gif) repeat-x 0 0; text-align: left; }
section.block03 ul.step > li { margin: 0; padding: 15px 0; background: url(../img_20180710/line_dot_green.gif) repeat-x 0 100%; }
section.block03 ul.step li p { font-size: 1.6rem; }
section.block03 ul.step li strong { position: relative; display: block; margin-bottom: 10px; color: #59ae4a; font-weight: bold; font-size: 2.4rem; }
section.block03 ul.step li strong:before { display: inline-block; margin-right: 10px; width: 37px; border-radius: 50%; background: #59ae4a; color: #ffffff; text-align: center; font-size: 1.8rem; line-height: 37px; }
section.block03 ul.step li:nth-child(1) strong:before { content: "1"; }
section.block03 ul.step li:nth-child(2) strong:before { content: "2"; }
section.block03 ul.step li:nth-child(3) strong:before { content: "3"; }
section.block03 ul.step li:nth-child(4) strong:before { content: "4"; }
section.block03 ol { display:-webkit-box; display:-moz-box; display:-ms-box; display:-webkit-flexbox; display:-moz-flexbox; display:-ms-flexbox; display:-webkit-flex; display:-moz-flex; display:-ms-flex; display:flex; margin:0 auto 25px; width: 1000px; -webkit-box-lines:multiple; -moz-box-lines:multiple; -webkit-flex-wrap:wrap; -moz-flex-wrap:wrap; -ms-flex-wrap:wrap; flex-wrap:wrap; }
section.block03 ol li { margin-right: 10px; padding: 15px 17px 0; width: 300px; background: #eee; }
section.block03 ol li:last-child { margin-right: 0; }
section.block03 ol li figure { display: block; margin-top: 20px; text-align: center; }
section.block03 ol dt { display: inline-block; margin-bottom: 13px; padding: 3px 7px; background: #59ae4a; color: #ffffff; font-size: 1.4rem; }
section.block03 ol dd { font-size: 1.6rem; }