@charset "UTF-8";

/*
 * frame
 * font
 * link
 * decoration
 */

/*
 * frame
 * =======================================================================================
 */

body {
	background-color: #fff;
	color: #4f4b49;
	font-family: "Lucida Grande", "ヒラギノ角ゴ ProN W3", "HiraKakuPro-W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", sans-serif;
	text-align: center;
}

h2 {
	margin-bottom: 70px;
}

.sectionblock {
	min-width: 1050px;
}
#header {
	background-color: #fff;
	border-bottom: 1px solid #e6e6e6;
	box-shadow: 0 0 10px #eaeaea;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: 10000;
}
#visual {
	/*background: #fff url("../image/bg-visual.jpg") repeat-x scroll left 83px;*/
	/*height: 565px;*/
	/*padding: 83px 0 52px;*/

	/*キャンペーン用（変更）*/
	background: #fff url("../image/bg-visual.jpg") repeat-x scroll left 0;
	height: 430px;
	padding: 0 0 52px;
}
#overview {
	background: #fff url("../image/bg-sectionblock-white-top.gif") repeat-x scroll left top;
	padding: 111px 0 60px;
	/*キャンペーン用（追加）*/
	margin-top: 150px;
}
#usage {
	background: #fff url("../image/bg-sectionblock-white-bottom.gif") repeat-x scroll left top;
	overflow: hidden;
	padding: 111px 0 60px;
}
#video {
	position: relative;
}
#download {
	background: #00b6e5 url("../image/bg-sectionblock-blue-top.gif") repeat-x scroll left top;
	padding: 111px 0 80px;
}
#peripheral {
	background: #fff url("../image/bg-sectionblock-blue-bottom.gif") repeat-x scroll left top;
	padding: 111px 0 80px;
}
#cooperation {
	background: #fff url("../image/bg-sectionblock-white-top.gif") repeat-x scroll left top;
	padding: 111px 0 60px;
}

.innerblock {
	margin: 0 auto;
	padding: 0 30px;
	position: relative;
	text-align: left;
	width: 990px;
}
.innerblock:before,
.innerblock:after {
	content: "";
	display: table;
}
.innerblock:after {
	clear: both;
}
#header .innerblock {
	padding: 20px 30px 15px;
}
#visual .innerblock {
	/*height: 565px;*/
	margin: 0;
	overflow: hidden;
	padding: 0;
	width: auto;
	/*キャンペーン用（変更）*/
	height: 482px;
}
#video .innerblock {
	background-color: #111;
	height: 160px;
	left: 0;
	margin: 0;
	overflow: hidden;
	padding: 0;
	position: absolute;
	top: -910px;
	width: 100%;
}
#footer .innerblock {
	border-top: 1px solid #456e7b;
	padding: 30px 0;
}

/*
 * font
 * ブラウザーのデフォルトフォントサイズは 16 px を想定
 * =======================================================================================
 */

#header {
	font-size: 81.25%; /* = 12px/16px */
	letter-spacing: 1px;
}
#header span {
	color: #999;
	font-size: 75.00%; /* = 9px/12px */
}

#visual {
	color: #fff;
	font-size: 175.00%; /* = 28px/16px */
	letter-spacing: 2px;
	line-height: 2.0;
	/*キャンペーン用（追加）*/
	margin-bottom: -83px;
}
#visual p {
	text-shadow: 2px 2px 6px #504a47;
}

#overview {
	font-size: 87.5%; /* = 14px/16px */
	letter-spacing: 1px;
	line-height: 2.0;
}
#overview dt {
	font-size: 128.57%; /* = 18px/14px */
}
#overview dd {
	font-size: 85.71%; /* = 12px/14px */
}
#overview dd .text em {
	font-size: 150.00%; /* = 18px/12px */
}
#overview dd .first .text em {
	color: #ff8562;
}
#overview dd .text .note {
	color: #00b7e6;
}
#overview dd .aside {
	font-size: 91.67%; /* = 11px/12px */
}

#download {
	color: #fff;
	font-size: 87.50%; /* = 14px/16px */
	letter-spacing: 1px;
	line-height: 2.0;
}
#download .flowarea {
	font-size: 92.86%; /* = 13px/14px */
}
#download .flowarea dt {
	font-size: 184.62%; /* = 24px/13px */
	line-height: 1.5;
}
#download .flowarea a {
	font-size: 84.62%; /* = 11px/13px */
}
#download .flowarea .note {
	color: #ff0;
	font-size: 92.31%; /* = 12px/13px */
}

#peripheral {
	font-size: 87.50%; /* = 14px/16px */
	letter-spacing: 1px;
	line-height: 1.8;
}
#peripheral p.name {
	font-size: 171.43%; /* = 24px/14px */
}
#peripheral p.caption {
	font-size: 85.71%; /* = 12px/14px */
}

#cooperation {
	font-size: 87.5%; /* = 14px/16px */
	letter-spacing: 1px;
	line-height: 1.8;
}

#footer {
	font-size: 68.75%; /* = 11px/16px */
}
#footer .util {
	letter-spacing: 1px;
}
#footer .copyright {
	font-weight: bold;
}
#footer span {
	line-height: 2.5;
}

/*
 * link
 * =======================================================================================
 */

#header a:link,
#header a:visited {
	color: #504a47;
	text-decoration: none;
}
#header a:hover,
#header a:active {
	text-decoration: underline;
}

#overview a {
	color: #504a47;
}
#overview .text a:link,
#overview .text a:visited {
	text-decoration: underline;
}
#overview .text a:hover,
#overview .text a:active {
	text-decoration: none;
}
#overview .aside a:link,
#overview .aside a:visited {
	text-decoration: none;
}
#overview .aside a:hover,
#overview .aside a:active {
	text-decoration: underline;
}

#download a {
	color: #fff;
}
#download .leadarea a:link,
#download .leadarea a:visited {
	text-decoration: underline;
}
#download .leadarea a:hover,
#download .leadarea a:active {
	text-decoration: none;
}
#download .flowarea a:link,
#download .flowarea a:visited {
	text-decoration: none;
}
#download .flowarea a:hover,
#download .flowarea a:active {
	text-decoration: underline;
}

#footer a {
	color: #546e7a;
	text-decoration: none;
}
#footer .util a:link,
#footer .util a:visited {
	text-decoration: none;
}
#footer .util a:hover,
#footer .util a:active {
	text-decoration: underline;
}
#footer .copyright span a:link,
#footer .copyright span a:visited {
	text-decoration: underline;
}
#footer .copyright span a:hover,
#footer .copyright span a:active {
	text-decoration: none;
}

/*
 * decoration
 * =======================================================================================
 */

/* header */

#header h1 {
	float: left;
}

#header .account {
	position: absolute;
	right: 30px;
	top: 27px;
}
#header .account li {
	display: inline;
}

#header .nav {
	margin: 15px 0 0 190px;
}
#header .nav li {
	display: inline;
	margin: 0 0.5em;
}

/* visual */

#visual .catch {
	left: 50%;
	margin-left: 45px;
	position: absolute;
	/*top: 140px;*/
	/*キャンペーン用（変更）*/
	top: 57px;
}
#visual .catch p {
	margin-bottom: 1.0em;
}

#visual .screen {
	background: transparent url("../image/bg-screen.png") no-repeat scroll left bottom;
	height: 565px;
	margin-right: 30px;
	position: absolute;
	right: 50%;
	width: 567px;
	/*キャンペーン用（追加）*/
	top: -83px;
}
#visual .screen li {
	left: 147px;
	position: absolute;
	top: 146px;
}

/* overview */

#overview .overviewcolumn {
	width: 100%;
}
#overview .overviewcolumn:before,
#overview .overviewcolumn:after {
	content: "";
	display: table;
}
#overview .overviewcolumn:after {
	clear: both;
}
#overview .overviewcolumn p {
	float: left;
	width: 400px;
}
#overview .overviewcolumn ul {
	float: right;
}
#overview .overviewcolumn li {
	margin-bottom: 1.2em;
}

#overview .step {
	margin-top: 50px;
}
#overview .step ol {
	background: transparent url("../image/bg-step-bottom.gif") no-repeat scroll left bottom;
	margin: 15px 0 0;
	padding-bottom: 10px;
}
#overview .step li {
	background: transparent url("../image/bg-step-middle.gif") no-repeat scroll left top;
	display: table;
	padding: 40px 0 20px;
	width: 990px;
}
#overview .step li.first {
	background: transparent url("../image/bg-step-top.gif") no-repeat scroll left top;
	padding-top: 20px;
}
#overview .step li div {
	display: table-cell;
	vertical-align: middle;
}
html*#overview .step li div {
	float: left;
}
#overview .step li .number {
	padding-left: 20px;
	text-align: center;
	width: 132px;
}
#overview .step li .text {
	padding: 0 20px;
}
#overview .step li .aside {
	padding-right: 20px;
	text-align: center;
	width: 300px;
}
#overview .step li .aside a {
	display: block;
	float: left;
	padding: 0 5px;
}
#overview .step li .aside span {
	display: block;
	text-align: left;
}
#overview .step li.first .aside a {
	display: inline;
	float: none;
	padding: 0 5px;
}

/* usage */

#usage h2 {
	margin-bottom: 300px;
}

#usage ul.nojs li {
	margin-bottom: 2.0em;
	text-align: center;
}

#usage .bx-wrapper {
	left: -441px;
	position: relative;
	width: 1872px;
}
#usage .bx-wrapper .bx-prev { left:  600px; }
#usage .bx-wrapper .bx-next { right: 600px; }
#usage .bx-wrapper .bx-controls-direction a { margin-top: -110px; }

/* video */

#video .video-trigger {
	background-color: #fff;
	cursor: pointer;
	overflow: hidden;
	position: relative;
	z-index: 120;
}
#video .video-trigger .video-image {
	width: 100%;
}
#video .video-trigger .video-text {
	left: 50%;
	margin-left: -267px;
	position: absolute;
	top: 42px;
}

#video .video-main {
	left: 50%;
	margin-left: -480px;
	position: absolute;
	top: 0;
	z-index: 110;
}
#video .video-close {
	cursor: pointer;
	position: absolute;
	right: 1px;
	top: 1px;
	z-index: 110;
}

/* download */

#download .downloadcolumn {
	width: 100%;
}
#download .downloadcolumn:before,
#download .downloadcolumn:after {
	content: "";
	display: table;
}
#download .downloadcolumn:after {
	clear: both;
}

#download .leadarea {
	float: left;
	width: 410px;
}

#download .flowarea {
	float: right;
	width: 485px;
}
#download .flowarea li.web {
	background: transparent url("../image/bg-flowarea-arrow.gif") no-repeat scroll center bottom;
	padding-bottom: 47px;
}
#download .flowarea li.app {
	background: #00aed0 url("../image/bg-apparea.gif") repeat scroll left -20px;
	border: 15px solid #fff;
	border-radius: 30px;
	margin-top: 15px;
	padding: 25px 25px;
}
#download .flowarea li.app ul {
	margin: 10px 0 0 -31px;
	width: 396px;
}
#download .flowarea li.app ul:before,
#download .flowarea li.app ul:after {
	content: "";
	display: table;
}
#download .flowarea li.app ul:after {
	clear: both;
}
#download .flowarea li.app li {
	float: left;
	margin-top: 10px;
	padding-left: 31px;
}

/* peripheral */

#peripheral p {
	left: 460px;
	position: absolute;
	top: 10px;
}

#peripheral .peripheralcolumn {
	margin: 0 auto;
	width: 928px;
}
#peripheral .peripheralcolumn:before,
#peripheral .peripheralcolumn:after {
	content: "";
	display: table;
}
#peripheral .peripheralcolumn:after {
	clear: both;
}
#peripheral .peripheralcolumn li {
	display: inline;
	float: left;
	padding: 0 40px;
	position: relative;
	text-align: center;
	width: 384px;
}
#peripheral .peripheralcolumn li ul {
	height: 355px;
	overflow: hidden;
	width: 384px;
}
#peripheral .peripheralcolumn li li {
	display: block;
	float: none;
	padding: 0;
	position: static;
	width: auto;
}
#peripheral .peripheralcolumn li p {
	margin-top: 1.0em;
	position: static;
}

/* cooperation */

#cooperation .cooperationcolumn {
	width: 100%;
}
#cooperation .cooperationcolumn:before,
#cooperation .cooperationcolumn:after {
	content: "";
	display: table;
}
#cooperation .cooperationcolumn:after {
	clear: both;
}
#cooperation .cooperationcolumn-1st {
	float: left;
	text-align: center;
	width: 420px;
}
#cooperation .cooperationcolumn-2nd {
	float: right;
	width: 560px;
}
#cooperation .cooperationcolumn-2nd ul {
	margin-top: 10px;
}
#cooperation .cooperationcolumn-2nd li {
	margin-bottom: 60px;
}
#cooperation .cooperationcolumn-2nd a {
	display: block;
	margin-top: 20px;
}
#cooperation .cooperationcolumn-2nd p {
	float: right;
	line-height: 4.0;
	text-align: center;
}



/* footer */

#footer .util {
	left: 315px;
	position: absolute;
	top: 45px;
	z-index: 10;
}
#footer .util li {
	border-right: 1px solid #546e7a;
	display: inline;
	float: left;
	padding: 0 10px;
}

#footer .sns {
	left: 400px;
	padding-left: 14.0em;
	position: absolute;
	top: 35px;
}
#footer .sns li {
	display: inline;
	margin-right: 5px;
}

#footer .share {
	position: absolute;
	right: 0;
	top: 40px;
}
#footer .share li {
	display: inline;
	float: left;
	margin-left: 5px;
}
#footer .share #twitter-widget-0 {
	width: 120px !important;
}

#footer img {
	vertical-align: bottom;
}
/* bannerCampaign */
#bnrCam,
#bnrCamTop {
	width: 100%;
	height: 105px;
	padding-top: 83px;
	background: #00b7e6;
	border-bottom: 2px solid #fff;
}
#bnrCam a {
	display: block;
	width: 100%;
	height: 100%;
	background: url(../../image/bnr-cam2.png) no-repeat center top;
	text-indent: -9999em;
}
#bnrCam a:hover {
	opacity: .6;
}
#bnrCam.textBnr {
	position: fixed;
	top: 83px;
	left: 0;
	height: auto;
	padding-top: 0;
	line-height: 1.5;
	z-index: 10000;
}
#bnrCam.textBnr a {
	padding: 5px 0;
	background-image: none;
	color: #fff;
	font-size: 14px;
	text-align: center;
	text-decoration: none;
	text-indent: 0;
}
.linkunderL {
	color: #000;
	text-decoration: underline;
}
#bnrCamTop a {
	display: block;
	width: 100%;
}
.bnrCamMiddle {
	width: 990px;
	margin: 0 auto 40px;
	background-color: #00b7e6;
}
.bnrCamMiddle a {
	display: block;
}

#social_buttons .share2{
	position: absolute;
	left: 50%;
	margin-left: 178px;
}

#social_buttons .share2 li{
	display: inline;
	float: left;
}

#social_buttons .share{
	position: absolute;
	left: 50%;
	margin-left: 178px;
}

#social_buttons .share li{
	display: inline;
	float: left;
}
.pauseArea {
	background: url("https://cdn.airregi.jp/res/partner/square/img/bg-sectionblock-white-bottom.gif?v=d7c338b") repeat-x scroll left top #FFFFFF;
	overflow: hidden;
	padding: 60px 0 15px;
	/*padding-top: 20px;*/
	width: 100%
}
.btn-apple {
	display: block;
	width: 135px;
	height: 40px;
	margin: 0 auto;
  background-image: url(/res/jp/asset/image/btn_dl_apple.png?v=a51ef33);
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: 135px 40px;
}